<template>
  <el-card>
    <!-- <el-table :data="tableData" style="width: 100%">
      <el-table-column prop="id" label="id" width="180"> </el-table-column>
      <el-table-column prop="operateDate" label="操作时间" width="280">
      </el-table-column>
      <el-table-column prop="operateContent" label="操作内容">
      </el-table-column>
      <el-table-column prop="ip" label="ip地址"> </el-table-column>
    </el-table> -->
    <el-timeline>
    <el-timeline-item :timestamp='(item.operateDate).slice(0, 16).replace("T","日")' placement="top" v-for="(item,index) in tableData" :key="index">
      <el-card>
        <h4>本次修改：</h4>
        <p>手机号为{{item.userTel}}的用户操作了{{item.operateContent}}接口</p>
        <p>操作IP地址为{{item.ip}},一切操作正常，已生成记录</p>
      </el-card>
    </el-timeline-item>
    <!-- <el-timeline-item timestamp="2018/4/3" placement="top">
      <el-card>
        <h4>本次修改</h4>
        <p>王小虎 提交于 2018/4/3 20:46</p>
      </el-card>
    </el-timeline-item>
    <el-timeline-item timestamp="2018/4/2" placement="top">
      <el-card>
        <h4>更新 Github 模板</h4>
        <p>王小虎 提交于 2018/4/2 20:46</p>
      </el-card> -->
    <!-- </el-timeline-item> -->
  </el-timeline>
    <el-pagination
      @size-change="changePageSize"
      @current-change="changeCurrentPage"
      :current-page="query.currentPage"
      :page-sizes="[5, 10, 15, 20]"
      :page-size="query.pageSize"
      layout="total, sizes, prev, pager, next, jumper"
      :total="total"
    >
    </el-pagination>

  </el-card>
</template>

<script>
import { createNamespacedHelpers } from "vuex";
const {  mapMutations } = createNamespacedHelpers("tags");
export default {

  data() {
    return {
      tableData: [],
      total: 0,
      query: {
        pageSize: 10,
        currentPage: 1,
      },
    };
  },
  methods: {
    ...mapMutations(["addTabs"]),
    async getlog() {
      const result = await this.$api.user.log(this.query);
      console.log("data", result);
      this.tableData = result.data.operate;
      console.log("why", result.data.operate);
      this.total = result.data.operate.length;
    },
    changeCurrentPage(args) {
      console.log("args", args);
      this.query.currentPage = args;
      this.getlog();
    },
    changePageSize(args) {
      console.log("args2", args);
      this.query.pageSize = args;
      this.getlog();
    },
  },
  beforeRouteEnter(to,from,next){
        next(vm=>{
           vm.addTabs(to)
        })
 },
  created() {
    this.getlog();
  },
};
</script>

<style>
</style>